<template>
  <a-modal :open="open" centered width="1000px" :title="type" @ok="onInsert" @cancel="onCancel">
    <BaseTable
      :key="type"
      :loading="loading"
      :columns="columns"
      class="mb-2"
      :data-source="dataSource"
      :scroll="['处置', '检验', '西成药'].includes(type) ? null : { x: 1200 }"
      :custom-row="(record) => ({ onClick: () => onSelect(record) })"
      :row-selection="{ selectedRowKeys, onChange: onSelectChange }"
      :height="400"
    >
      <!-- <template #bodyCell="{ column, record }"> </template> -->
    </BaseTable>
    <div class="flex justify-end">
      <a-textarea v-model:value="customInput" :rows="5" placeholder="请选择项目" />
    </div>
  </a-modal>
</template>

<script setup>
import { ref, watch } from 'vue'

import useInsertConfig from './useInsertConfig'
// import usePatientsStore from '../../../store'

// const patientsStore = usePatientsStore()
const customInput = ref(null)
const props = defineProps({
  open: {
    type: Boolean,
    default: false
  },
  type: {
    type: String,
    default: '处置',
    desc: '处置/西成药/中草药/检查/检验/手术'
  }
})
const emit = defineEmits(['update:open', 'ok'])
const { columns, loading, dataSource } = useInsertConfig(props)
watch(
  () => props.open,
  (val) => {
    if (!val) customInput.value = null
  }
)
const selectedRowKeys = ref([])
const selectedRows = ref([])
const onSelectChange = (keys, rows) => {
  selectedRowKeys.value = keys
  selectedRows.value = rows
}
const onSelect = (record) => {
  //选中or 取消
  if (selectedRowKeys.value.includes(record.key)) {
    selectedRowKeys.value = selectedRowKeys.value.filter((key) => key !== record.key)
    selectedRows.value = selectedRows.value.filter((row) => row.key !== record.key)
  } else {
    selectedRowKeys.value.push(record.key)
    selectedRows.value.push(record)
  }
}
watch(
  () => selectedRows.value,
  () => {
    customInput.value = selectedRows.value
      .map((item) => {
        let str = ''
        switch (props.type) {
          case '处置':
            str = `${item.mc} * ${item.sl}${item.dw} `
            break
          case '检验':
            str = `${item.categroyName} - ${item.items} `
            break
          case '西成药':
            str = `${item.mc} * ${item.sl}${item.dw} `
            break
          case '中草药':
            str = `${item.mc} * ${item.fssl}付 `
            break
          case '手术':
            str = `${item.oprName} `
            break
          case '检查':
            str = `${item.mc} `
            break
        }
        return str
      })
      .join('，')
  },
  {
    deep: true
  }
)

const onInsert = () => {
  emit('ok', customInput.value)
}

const onCancel = () => {
  emit('update:open', false)
}
</script>
<style lang="less" scoped>
:deep(.ant-table-row-expand-icon) {
  display: none;
}
</style>
